﻿<#import "../../_layout.ftl" as layout>
${Html.s("pagetitle",Html.w(id==0,"新建","修改")+"流程模型")}
<@layout._layout>
<style>
    .mleft {
        margin-left: 200px;
    }
    .tb textarea{
        width: 95%;
    }
    .mydetail label{
        width: 250px;
    }
    .main_cont{
        margin-left: 10px;
    }
</style>
    <script src="/content/gojs/1.8.13/go.js"></script>
    <script src="/content/js/flow2.js"></script>
<script type="text/javascript">

    $(function(){
        changeflowtab('flow');
    });
    function changeflowtab(div) {
        $('div [name="flowtab"]').hide();
        $('#'+div).show();
    }
    function checkXml(isjson,callback){
        var json=null;var xml =null;
        if(isjson) {
            json = $("#design")[0].contentWindow.modelToJson();
            json = JSON.stringify(json);
        }else{
            xml =  $("#textxml").val();
        }
        if((xml==null||""==xml)&&(json==null||json==""||json=="null")) {
            return;
        }
        //alert(JSON.stringify(j));
            $.post("/manager/model/xml",
                {
                    'json': json,
                    'xml':xml
                },
                function (data) {
                    if (data.code < 0) {
                        alert(data.message);
                    } else {
                        $("#textxml").val(data.data);
                        callback();
                    }
                }, "json");
    }

    function save(type)
    {
        checkXml($('#xml').is(":hidden"),
            function () {
                $.post("/manager/model/save",
                    {
                        "id": ${id!"0"},
                        "name": $("#name").val(),
                        "title": $("#title").val(),
                        "xml": $("#textxml").val(),
                        "pc_form": JSON.stringify($('[filed="pc_form"]').val()),
                        "mobile_form": JSON.stringify($('[filed="mobile_form"]').val()),
                        'type': type,
                        'model_type': $('#model_type').val()
                    },
                    function (data) {
                        if (data.code < 0) {
                            alert(data.message);
                        } else {
                            alert("保存成功");
                            if (type != "debug") {
                                window.location = '/manager/model/index';
                            }
                        }
                    }, "json");
            }
        );
    }

</script>
<div class="head" style="margin-left: 190px;">
    <div class="title">
    ${Html.w(id==0,"新增","修改")}流程模型 ${Html.help("新建流程模型")}
    </div>
</div>
<div>
    <ul class="mydetail">
        <li style="">
            <input type="button"  value="流程设计器" class="btn1" onclick="changeflowtab('flow');">
            <input style="margin-left: 0px" type="button" value="流程编辑器" class="btn1" onclick="checkXml(true,function (){changeflowtab('xml');});">
            <input style="margin-left: 0px" type="button" value="PC端编辑器" class="btn1" onclick="changeflowtab('pc')">
            <input type="button" style="margin-left: 5px" value="手机端编辑器" class="btn1" onclick="changeflowtab('mobile')">
        </li>
        <li id="liflow">
<#--            <label></label>-->
          <div id="flow" name="flowtab" class="mleft" style="margin-top: 5px">
                <div>流程设计器(<b>及时保存</b>)</div>
                <iframe id="design" style="width:95%;height: 500px;" src="/manager/model/flow?id=${id!}"></iframe>
<#--                <div id="myDiagramDiv" style="height: 500px; background-color: #DAE4E4;"></div>-->
            </div>
            <div id="xml" name="flowtab" class="mleft" style="margin-top: 5px">
                <div>流程编辑器</div>
                <textarea id="textxml" rows="50" cols="20" style="width: 80%">${model.xml!}</textarea>
            </div>
            <div id="pc" name="flowtab" class="mleft" style="margin-top: 5px">
                <div>PC编辑器</div>
                <textarea id="pc_html" rows="50" cols="20" filed="pc_form" style="width: 80%">${model.pc_form_url!}</textarea>
            </div>
            <div id="mobile" name="flowtab" class="mleft" style="margin-top: 5px">
                <div>Mobile编辑器</div>
                <textarea id="mobile_html" rows="50" cols="20" filed="mobile_form" style="width: 80%">${model.mobile_form_url!}</textarea>
            </div>
        </li>

        <li>
            <label>模型名称</label><input class="mylongtext" type="text" id="name" name="name" value="${model.name!}" />
        </li>
        <li>
            <label>模型标题</label><input class="mylongtext" type="text" id="title" name="title" value="${model.title!}"/>
        </li>
        <li>
            <label>模型类型</label>
            <select id="model_type" name="model_type">
                <#list Html.enums("com.yh.csx.bsf.flow.provider.enums.ModelTypeEnum") as item>
                    <option value="${Html.filed(item,"Value")}" ${Html.w(model.model_type==Html.filed(item,"Value"),"selected='selected'","")}>${Html.filed(item,"Desc")}</option>
                </#list>
            </select>
        </li>
        <li>
            <#if id!=0>
                <input type="button" class="btn1" style="" value="保存当前版本" onclick="return save('debug')" />
                <input type="button" class="btn1" style="margin-left: 10px" value="发布新版本" onclick="return save('new')" />
            <#else>
                <input type="button" class="btn1" style="" value="发布新版本" onclick="return save('new')" />
            </#if>

        </li>
    </ul>
</div>
</@layout._layout>